<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="css/mystyle.css">
    <script src="https://at.alicdn.com/t/font_1862857_evian7ecfwq.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.js"></script>
    <!-- <script type="text/javascript" src="js/switch.js"></script> -->
</head>
<body>
    <div class="header">
    </div>
    <div class="banner">
        <div class="login-form">
            <p class="login-type">
                <a href="#" class="active">账号登录</a>
                <span class="split">|</span>
                <a href="#">扫码登录</a>
            </p>
            <div id="login-type-id">
                <div class="number-login">
                    <p class="input-number">
                        <input type="text" placeholder="邮箱/手机号/小米账号"/>
                    </p>
                    <p class="password">
                        <input type="text" placeholder="密码"/>
                    </p>
                    <p class="submit">
                        <input type="submit" value="登录"/>
                    </p>
                    <p class="register">
                        <span><a href="https://cn.account.xiaomi.com/pass/register?callback=https%3A%2F%2Forder.mi.com%2Flogin%2Fcallback%3Ffollowup%3Dhttps%253A%252F%252Fwww.mi.com%252Findex.html%26sign%3DMjM0MWU0NjBlOTU1YzY4NGQzOTc3MDk4N2M2MjQ5Y2ZiZTMxNTFlZQ%2C%2C&sid=mi_eshop&_bannerBiz=mistore&_qrsize=180">注册小米账号</a></span>
                        <span>|</span>
                        <span><a href="https://account.xiaomi.com/pass/forgetPassword?callback=https%3A%2F%2Forder.mi.com%2Flogin%2Fcallback%3Ffollowup%3Dhttps%253A%252F%252Fwww.mi.com%252Findex.html%26sign%3DMjM0MWU0NjBlOTU1YzY4NGQzOTc3MDk4N2M2MjQ5Y2ZiZTMxNTFlZQ%2C%2C&sid=mi_eshop&_bannerBiz=mistore&_qrsize=180">忘记密码?</a></span>
                    </p>
                    <div class="login-footer">
                        <p class="login-other-title">——————————其他方式登录—————————</p>
                        <div class="all-icons">
                            <a href="#">
                                <svg class="icon" aria-hidden="true">
                                    <use xlink:href="#icon-QQ11"></use>
                                </svg>
                            </a>
                            <a href="#">
                                <svg class="icon" aria-hidden="true">
                                    <use xlink:href="#icon-weibo"></use>
                                </svg>
                            </a>
                            <a href="#">
                                <svg class="icon" aria-hidden="true">
                                    <use xlink:href="#icon-zhifubao"></use>
                                </svg>
                            </a>
                            <a href="#">
                                <svg class="icon" aria-hidden="true">
                                    <use xlink:href="#icon-weixin1"></use>
                                </svg>
                            </a>
                        </div>
                    </div>
                </div>
                <div class="saoma-login">
                    <div class="saoma-content">
                        <img src="images/sao.png" alt="">
                        <p>使用<span class="xiaomi-yellow-color">小米商城APP</span>扫一扫</p>
                        <p>小米手机可打开「设置」>「小米帐号」扫码登录</p>
                    </div>
                </div>
            </div>
            
            
        </div>
    </div>
    <div class="footer">
        <p class="language">
            <span>简体</span>
            <span style="color:#e0e0e0">&nbsp;&nbsp;|&nbsp;&nbsp;</span>
            <span>繁体</span>
            <span style="color:#e0e0e0">&nbsp;&nbsp;|&nbsp;&nbsp;</span>
            <span>English</span>
            <span style="color:#e0e0e0">&nbsp;&nbsp;|&nbsp;&nbsp;</span>
            <span>常见问题</span>
        </p>
        <p class="copyright">
            <span>小米公司版权所有-京ICP备10046444-</span>
            <img src="images/icon.png" alt="">
            <span>京公网安备11010802020134号-京ICP证110507号</span>
        </p>
    </div>

    <script>
        let links = $(".login-type>a");
        for(let i =0;i<links.length;i++){
            links[i].index = i;
        }

        links.click(function(){
            $(this).addClass("active").siblings().removeClass("active");
            $("#login-type-id").children().hide().eq(this.index).show();
        });
    </script>
</body>
</html>